<template>
  <div class="container">
    <table>
      <thead>
      <tr class="title">
        <th class="enterprise-name">企业名称</th>
        <th>中智北京</th>
        <th>中智安徽</th>
        <th>中智广州</th>
        <th>中智香港</th>
        <th>中智薪税</th>
        <th>中智职业发展</th>
      </tr>
      </thead>
      <tbody>
      <tr>
        <td>工资总额增幅</td>
        <td>6.73%</td>
        <td>9.23%</td>
        <td>8.68%</td>
        <td>7.16%</td>
        <td>6.49%</td>
        <td>4.49%</td>
      </tr>
      <tr>
        <td>利润总额增幅</td>
        <td>3.30%</td>
        <td>2.54%</td>
        <td>6.84%</td>
        <td>6.95%</td>
        <td>2.70%</td>
        <td>2.23%</td>
      </tr>
      </tbody>
    </table>
  </div>
</template>

<script setup>

</script>

<style scoped>
table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 20px;
}

th, td {
  text-align: left;
  padding: 10px;
  font-family: 'PingFang', serif;
  font-size: 12px;
  color: #44444F;
  font-weight: bold;
}

th {
  background: #F5F7FF;
  border-radius: 4px;
}

.container {
  border: 1px solid rgba(226, 232, 240, 1);
  padding: 20px;
}

.enterprise-name {
  width: 25%;
}
</style>